<template>
    <div>
            <!-- 面包屑导航 -->
            <el-breadcrumb separator-class="el-icon-arrow-right">
            <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
            <el-breadcrumb-item>活动管理</el-breadcrumb-item>
            </el-breadcrumb>

            <el-form :inline="true" model="" class="user-search">
                <el-form-item label="搜索：">
                    <el-input size="small" placeholder="输入活动名" clearable v-model="paraData.releaseName"></el-input>
                </el-form-item>
                <el-form-item>
                    <el-input size="small"  placeholder="输入活动内容" clearable v-model="paraData.releaseContent"></el-input>
                </el-form-item>
                <el-form-item>
                    <el-select size="small"  placeholder="请选择审核状态" clearable v-model="paraData.releaseReviewStatus">
                        <el-option  label="待审核" value="待审核" ></el-option>
                        <el-option  label="已审核" value="已审核" ></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item>
                    <el-select size="small"  placeholder="请选择活动类型" clearable v-model="paraData.releaseType">
                        <el-option  label="模拟类型" value="模拟类型" ></el-option>
                        <el-option  label="新闻" value="新闻" ></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item>
                    <el-button size="small" type="primary" icon="el-icon-search" @click="search">查询</el-button>
                </el-form-item>
            </el-form>

            <el-table
                ref="multipleTable"
                :data="tableData"
                tooltip-effect="dark"
                style="width: 100%"
                @selection-change="handleSelectionChange">
                <el-table-column
                type="selection"
                width="55">
                </el-table-column>

                <el-table-column
                label="名称"
                width="120">
                <template slot-scope="scope">{{scope.row.releaseName}}</template>
                </el-table-column>

                <el-table-column
                prop="releasePerson"
                label="发布人"
                width="120">
                </el-table-column>
                <el-table-column
                prop="releaseTime"
                :formatter="formatDateTime"
                label="创建时间"
                width="180"
                >
                </el-table-column>
                <el-table-column
                label="审核状态"
                width="120"
                >
                    <template slot-scope="scope">{{scope.row.releaseReviewStatus=='已审核'?'已审核':'待审核'}}</template>
                </el-table-column>
                <el-table-column
                prop="releaseReviewer"
                label="审核人"
                width="120"
                show-overflow-tooltip
                >
                </el-table-column>
                <el-table-column
                prop="releaseType"
                label="活动类型"
                width="120"
                show-overflow-tooltip
                >
                </el-table-column>

                <el-table-column
                label="操作"
                width="100">
                <template slot-scope="scope">
                    <el-button @click="handleClick(scope.row)" type="text" size="small">查看</el-button>
                    <el-button type="text" size="small" @click="approval(scope.row)">编辑</el-button>
                </template>
                </el-table-column>
            </el-table>
            <Page v-bind:child-msg="pageparm" @callFather="callFather"></Page>

            <!-- Form -->

            <el-dialog title="审批" :visible.sync="dialogForm" width="30%">
                <el-form :model="form">
                    <el-form-item label="活动名称" label-width="120">
                        <el-col span="14">
                            <el-input v-model="form.releaseName"  ></el-input>
                        </el-col>
                    </el-form-item>
                    <el-form-item label="审批状态" label-width="120">
                    <el-select v-model="form.releaseReviewStatus" placeholder="请选择审批状态">
                        <el-option label="通过" value="已审核"></el-option>
                        <el-option label="未通过" value="未审核"></el-option>
                    </el-select>
                    </el-form-item>
                </el-form>
                <div slot="footer" class="dialog-footer">
                    <el-button @click="dialogForm = false">取 消</el-button>
                    <el-button type="primary" @click="updateStatus">确 定</el-button>
                </div>
            </el-dialog>
    </div>
</template>
<script>
    import Page from "../../components/Pagination.vue";
    export default {
        components:{
            Page
        },
        data() {
            return {
                input: '',
                paraData: {
                    releaseContent: "",
                    releaseReviewStatus: "",
                    releaseName: "",
                    releaseType: ""
                },
                tableData: [
                ],
                multipleSelection: [],
                //作为初始发送的数据或者接收分页子组件的变化数据，数据最终发送到后端进行分页处理
                pageLine: {
                    page: 1,
                    limit: 5,
                },
                // 分页参数，父组件单项绑定-->指向分页子组件的props:[childMsg]
                pageparm: {
                    currentPage: 1,
                    pageSize: 5,
                    total: 0,
                },
                dialogForm: false,
                form:{}
            }
        },
        created(){
            console.log("创建了");
            // this.$axios.post("api/review/findRelease",{
            //     "currentPage": 1,
            //     "limit": 10,
            //     "data": {
            //         "releaseContent": "",
            //         "releaseReviewStatus": "",
            //         "releaseName": "",
            //         "releaseType": ""
                    
            //     }
            // }).then(res=>{
            //     console.log(res)
            // }).catch()
            this.getActivities(this.pageLine.page,this.pageLine.limit,this.paraData);
        },
        methods:{
            getActivities(current,limit,paraData){
                this.$axios.post("http://localhost:6061/review/findRelease",
                {
                    currentPage: current,
                    limit: limit,
                    data: paraData
                },
                {
                    headers:{'Authorization':localStorage.getItem("token")}
                }
                )
                .then((res) => {
                    console.log(res);
                    if(res.data.code==404){
                        this.tableData =  [];
                    }
                    this.tableData =  res.data.data.list;
                    this.pageparm.currentPage = res.data.data.pageNum;
                    this.pageparm.pageSize = res.data.data.pageSize;
                    this.pageparm.total = res.data.data.total;

            });
            },
            //子组件参数变化触发的父组件方法
            callFather(parm) {
                this.pageLine.page = parm.currentPage;
                this.pageLine.limit = parm.pageSize;
                //然后再次调用页面加载的方法(传入pageLine)
                this.getActivities(this.pageLine.page,this.pageLine.limit,this.paraData);
            },
            approval(data){
                this.dialogForm = true;
                this.form = data;
            },
            search(){
                console.log(this.paraData)
                this.getActivities(this.pageLine.page,this.pageLine.limit,this.paraData);
                
            },
            updateStatus(){
                this.dialogForm = false;
                console.log(this.form.id);
                let uid = JSON.parse(localStorage.getItem("userdata")).id;
                this.$axios.get("api/review/releaseReview",{
                   params:{
                        ReleaseId:this.form.id,
                        id: uid
                   }
                }
                ).then(res=>{
                    console.log(res)
                }).catch()
            }
        }
  }
</script>